<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!DOCTYPE html>
suppress ALL
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="author" content="Lei Shi">
    <meta http-equiv="Cache-Control" content="o-transform">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <meta name="csrf-token" content="1483780974##87f89328c5616669f00302a263fe9061bb852818">
<!--    <title th:text="${course.courseName}"></title>-->

    <script type="text/javascript" th:src="@{/static/lib/jquery/1.9.1/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/static/lib/layer/2.4/layer.js}"></script>
    <script type="text/javascript" th:src="@{/static/lib/laypage/1.2/laypage.js}"></script>
    <link rel="stylesheet" th:href="@{/static/lib/bootstrap/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/static/css/styles-2016121272249.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/static/lib/laypage/1.2/skin/laypage.css}">

    <style>
        @font-face {
            font-family: "lantingxihei";
            src: url("static/font/FZLTCXHJW.TTF");
        }

        form {
            display: none;
        }

        #courseList {
            display: none;
        }

        /* modal 模态框*/
        #invite-user .modal-body {
            overflow: hidden;
        }

        #invite-user .modal-body .form-label {
            margin-bottom: 16px;
            font-size: 14px;
        }

        #invite-user .modal-body .form-invite {
            width: 80%;
            padding: 6px 12px;
            background-color: #eeeeee;
            border: 1px solid #cccccc;
            border-radius: 5px;
            float: left;
            margin-right: 10px;
        }

        #invite-user .modal-body .msg-modal-style {
            background-color: #7dd383;
            margin-top: 10px;
            padding: 6px 0;
            text-align: center;
            width: 100%;
        }

        #invite-user .modal-body .modal-flash {
            position: absolute;
            top: 53px;
            right: 74px;
            z-index: 999;
        }

        /* end modal */

        .en-footer {
            padding: 30px;
            text-align: center;
            font-size: 14px;
        }
    </style>
</head>
<body th:each="list : ${list}">

<nav class="navbar navbar-default navbar-fixed-top header">
    <div class="container">
        <div class="collapse navbar-collapse" id="header-navbar-collapse">
            <ul class="nav navbar-nav">
                <li class="dropdown active">
                    <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown">
                        课程
                        <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu">
                        <li><a class="active" href="">全部课程</a></li>
                        <li><a class="" href="">即将上线</a></li>
                    </ul>
                </li>

            </ul>
            <div class="navbar-right btns">
                <a class="btn btn-default navbar-btn sign-in" data-sign="signin" href="#sign-modal" data-toggle="modal">登录</a>
                <a class="btn btn-default navbar-btn sign-up" data-sign="signup" href="#sign-modal" data-toggle="modal">注册</a>
            </div>
        </div>
    </div>
</nav>
<div class="container layout layout-margin-top">

    <div class="row">
        <div class="col-md-9 layout-body">
            <div class="side-image side-image-mobile">
                <img src="static/picture/ncn111.jpg">
            </div>

        <div class="col-md-3 layout-side">
            <div class="side-image side-image-pc">
                <strong>课程封面：</strong><img th:text="${list.course.coursePic}">
            </div>
            <div class="sidebox mooc-teacher">

<!--                <div class="mooc-extra-info">-->
<!--                    <div class="word long-paragraph">-->
<!--                        <strong>课程封面：</strong><img th:text="${list.course.coursePic}">-->
<!--                    </div>-->
<!--                </div>-->
                <div class="sidebox-body mooc-content">
                    <div class="mooc-info">
                        <h4 class="sidebox-title">课程名：</h4>
                        <div class="name">
                            <span th:text="${list.course.courseName}"></span>
                        </div>
                    </div>
                    <div class="mooc-extra-info">
                        <div class="word long-paragraph">
                            <strong>课程简介：</strong>
                            <span th:text="${list.course.courseIntroduction}"></span>
                        </div>
                    </div>
                    <div class="mooc-extra-info">
                        <div class="word long-paragraph">
                            <strong>学习时间：</strong>
                            <span th:text="${list.studyBuytime}"></span>
                        </div>
                    </div>
                    <div class="mooc-extra-info">
                        <div class="word long-paragraph">
                            <strong>学习进度：</strong>
                            <span th:text="${list.studyJindu}"></span>
                          <a href="#">开始学习</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
            <div class="side-image">
            </div>
        </div>
    </div>
</div>



</body>
</html>